<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <th:block th:include="include :: header('列表')"/>
    <script th:src="@{/static/admin/js/pdf.js}"></script>
    <script th:src="@{/static/admin/js/pdf.worker.js}"></script>
    <script src="./preview.js"></script>
</head>
<style>
    .evidence {
        width: 100%;
    }

    .evidence_left {
        float: left;
        width: 20%;
    }

    .evidence_right {
        float: right;
        width: 80%;
    }

    .clear {
        clear: both
    }

    .title {
        padding: 10px;
        display: block;
        border-left: #36b368 solid 4px;
        color: #333;
        font-weight: bold;
        font-size: 14px;
        background: #f2f2f2;
    }

    #iconicResult {
        /*margin-left: 30px;*/
        /*margin-top: 5px;*/
    }

    #iconicResult div {
        background: #eee;
        padding: 10px;
        border-bottom: #c9c9c9 solid 1px;
    }

    #iconicResult p {
        display:block;
        line-height: 20px;
        margin-bottom: 10px;
        margin-right: 7px;
        font-size: 13px;
        padding: 0 5px;
        border-bottom: #f0f1f2 solid 1px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }

    #qualityBonus {
        /*margin-left: 30px;*/
        /*margin-top: 5px;*/
    }

    #qualityBonus div {
        background: #eee;
        padding: 10px;
        border-bottom: #c9c9c9 solid 1px;
    }

    #qualityBonus p {
        display: block;
        line-height: 20px;
        margin-bottom: 10px;
        margin-right: 7px;
        font-size: 13px;
        padding: 0 5px;
        border-bottom: #f0f1f2 solid 1px;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
</style>
<body class="pear-container">
<div class="evidence">
    <div class="layui-form-item" style="padding-top: 5px">
        <label class="layui-form-label">上传文件</label>
        <div class="layui-input-block">
            <input type="text" name="plusScore" id="plusScore" autocomplete="off" placeholder="上传文件"
                   class="layui-input layui-hide">
            <button class="layui-btn layui-btn-normal layui-hide" id="testList" type="button">上传文件</button>
            <button class="layui-btn layui-hide" id="testListAction" type="button">开始上传</button>
            <button style="margin-right: 10px; float:left;" class="layui-btn layui-btn-normal" type="button"
                    onclick="selectDocument()"> 点击上传
            </button>
            <span id="fileName" style="color: red" class="layui-hide"></span>
            <div id="supportingList" style="float: left;"></div>
            <div class="clear"></div>
        </div>
    </div>
    <div style="margin-right: 20px;">
        <div class="evidence_left">
            <div style="margin-bottom: 20px;">
                <label class="title">文件--pdf</label>
                <div id="iconicResult">

                </div>
            </div>
<!--            <div>-->
<!--                <label class="title">文件&#45;&#45;jpg</label>-->
<!--                <div id="qualityBonus"></div>-->
<!--            </div>-->
        </div>
    </div>
    <div class="evidence_right">
        <iframe id="pdf" width="100%" hight="100%"></iframe>
    </div>
    <div class="clear"></div>
</div>


</body>
<th:block th:include="include :: footer"/>
<script th:inline="javascript" type="text/javascript">

    var upload = layui.upload;

    var MODULE_PATH = rootPath + "/InfoFileController/";

    var iconicResultHtml = "";
    var infoFiles = [[${infoFiles}]];
    var recordId = [[${recordId}]];
    var fkSubject = [[${fkSubject}]];
    var taskid = [[${taskid}]];
    var step = [[${step}]];
    console.log("---------------" + fkSubject)
    for (var i = 0; i < infoFiles.length; i++) {
        if (infoFiles[i].suffix === '.pdf') {
            // if (taskScoreProofList[i].privates === '1') {
            iconicResultHtml += '<div><p title="' + infoFiles[i].fileName+
                '">' + infoFiles[i].fileName + '</p>' +
                '<button type="button" class="layui-btn layui-btn-sm layui-btn-normal" onclick="viewFile(\'' + infoFiles[i].fileUrl + '\')">查看</button>' +
                '<button type="button" class="layui-btn layui-btn-sm layui-btn-danger" onclick="delFilebyRecordId(\'' + recordId + '\')">删除</button> </div>';
            // }
        }
        $('#iconicResult').html(iconicResultHtml);
    }

    function viewFile(e) {
        $("#pdf").attr("height", $(document).height());
        $("#pdf").attr("src", e);
    }

    function viewFilejpg(e) {
        var index = layer.open({
            type: 2 ,
            title: '文件上传',
            shade: 0.1,
            // area: ['1500px', '800px'],
            // area: ['1500px', '800px'],
            content: MODULE_PATH + 'upload/pic?e='+e
        });
        layer.full(index)
    }


    // function delInfoFile(fileId) {
    //     // layer.msg(e);
    //     $.ajax({
    //         url: MODULE_PATH + '/delInfoFile',
    //         dataType: 'json',
    //         type: 'post',
    //         data: {
    //             "id": fileId
    //         },
    //         success: function (result) {
    //             if (result.code === 200) {
    //                 layer.msg(result.msg, {icon: 1, time: 1000}, function () {
    //                     getCorroborationList();
    //                 });
    //             } else {
    //                 layer.msg(result.msg, {icon: 2, time: 1000});
    //             }
    //         }
    //     })
    // }

    function delFilebyRecordId(recordId) {
        // layer.msg(e);
        $.ajax({
            url: MODULE_PATH + '/delFilebyRecordId',
            dataType: 'json',
            type: 'post',
            data: {
                "fkRecord": recordId
            },
            success: function (result) {
                if (result.code === 200) {
                    layer.msg(result.msg, {icon: 1, time: 1000}, function () {
                        getCorroborationList();
                        $('#pdf').contents().find('body').empty();
                    });
                } else {
                    layer.msg(result.msg, {icon: 2, time: 1000});
                }
            }
        })
    }

    upload.render({
        elem: '#testList'
        , url: MODULE_PATH + '/excelFileUpload' //改成您自己的上传接口
        , accept: 'file'
        , exts: 'xlsx|xls' //允许上传的文件类型
        , multiple: true
        , auto: false
        , bindAction: '#testListAction'
        , choose: function (obj) {
            $('#testListAction').click()
        }
        , before: function (obj) {
            this.data = {
                'folderName': 'wx',
                'recordId': recordId,
                'fkSubject': fkSubject,
                'taskid': taskid,
                'step': step,
            };
        }
        , done: function (res, index, upload) {
            if (res.code == 0) {
                getCorroborationList();
                layer.msg(res.msg, {icon: 1, time: 1000});
            } else {
                layer.msg(res.msg, {icon: 2, time: 1000});
            }
        }
    });

    window.selectDocument = function selectDocument() {
        $('#testList').click()
    }

    function getCorroborationList() {
        $.ajax({
            url: MODULE_PATH + 'getFilebyRecordId',
            dataType: 'json',
            type: 'post',
            data: {
                fkRecord: recordId,
                fkSubject: fkSubject,
                fkTaskId: taskid
            },
            success: function (result) {
                var listFiles = result.listFiles;
                var pdfLists = '';
                console.log(listFiles)
                for (var i = 0; i < listFiles.length; i++) {
                    if (listFiles[i].suffix === '.pdf') {
                        // if (taskScoreProofList[i].privates === '1') {
                        // pdfLists += '<a onclick="viewFile(\'' + listFiles[i].fileUrl + '\')">' + listFiles[i].fileName + '</a>'+
                        //     '<span onclick="delInfoFile(\'' + listFiles[i].id +  '\')">删除</span></div>';
                        pdfLists += '<div><p>' + listFiles[i].fileName + '</p>' +
                            '<button type="button" class="layui-btn layui-btn-sm layui-btn-normal" onclick="viewFile(\'' + listFiles[i].fileUrl + '\')">查看</button>' +
                            '<button type="button" class="layui-btn layui-btn-sm layui-btn-danger" onclick="delFilebyRecordId(\'' + recordId + '\')">删除</button> </div>';
                        // }
                    }
                }
                $('#iconicResult').html(pdfLists)
            }
        })
    }

    //删除佐证
    // window.delFile = function (id, localPath) {
    //     $.ajax({
    //         url: MODULE_PATH + '/delEvidence',
    //         dataType: 'json',
    //         type: 'post',
    //         data: {
    //             "id": id,
    //             "localPath": localPath
    //         },
    //         success: function (result) {
    //             if (result.code === 200) {
    //                 layer.msg(result.msg, {icon: 1, time: 1000}, function () {
    //                     getEvidenceList();
    //                 });
    //             } else {
    //                 layer.msg(result.msg, {icon: 2, time: 1000});
    //             }
    //         }
    //     })
    // }
</script>
</html>